<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>读取本地文件</title>
</head>
<body>
<input type="file" id="fileInput" />
<pre id="fileContent"></pre>

<script src="./js/pcmPlayer.js"></script>
<script >

    // 获取文件输入框和显示内容的元素
    const fileInput = document.getElementById('fileInput');
    const fileContent = document.getElementById('fileContent');
    let player = new PCMPlayer({
        encoding: "16bitInt",
        channels: 1,
        sampleRate: 22050,
        flushingTime: 180
    });
    // 监听文件选择事件
    fileInput.addEventListener('change',  (event)=> {
        // 获取选择的文件
        const file = event.target.files[0];
        console.log("44444444444444")

        if (file) {
            // 创建 FileReader 对象
            const reader = new FileReader();
            // 以 ArrayBuffer 形式读取文件
            reader.readAsArrayBuffer(file);
            // player.destroy()
            console.log("2222222")
            player.destroy()
             player = new PCMPlayer({
                encoding: "16bitInt",
                channels: 1,
                sampleRate: 22050,
                flushingTime: 180
            });
            console.log("3333333")

            reader.onload = function (e) {
                const arrayBuffer = e.target.result;
                const uint8Array = new Uint8Array(arrayBuffer);
                console.log("测试",uint8Array)
                player.feed(uint8Array);
            };

            // 文件读取失败时的回调
            reader.onerror = function (e) {
                console.error('文件读取失败:', e.target.error);
            };
        } else {
            fileContent.textContent = '未选择文件';
        }
    });

</script>
</body>
</html>